<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en" class="no-js">
<!--<![endif]-->
<!-- BEGIN HEAD -->

<head>
	<meta charset="utf-8">
	<title>故障点详情</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width, initial-scale=1" name="viewport">
	<meta content="" name="description">
	<meta content="" name="author">
	<link href="../assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
	<link href="../assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css">
	<link href="../assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
	<link href="../assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css">
	<!-- END GLOBAL MANDATORY STYLES -->
	<!-- BEGIN THEME STYLES -->
	<link href="../assets/global/css/components-rounded.css" id="style_components" rel="stylesheet" type="text/css">
	<link href="../assets/global/css/plugins.css" rel="stylesheet" type="text/css">
	<link href="../assets/admin/layout3/css/layout.css" rel="stylesheet" type="text/css">
	<link href="../assets/admin/layout3/css/themes/default.css" rel="stylesheet" type="text/css" id="style_color">
	<link href="../assets/admin/layout3/css/customadmin.css" rel="stylesheet" type="text/css">
	<!-- END THEME STYLES -->
	<link rel="shortcut icon" href="img/logo.png" />
	<style>
		[v-cloak]{
			display: none;
		}
	</style>
</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->

<body>

	<div id="app">
	<!-- BEGIN PAGE CONTAINER -->
		<div class="page-container" v-cloak>
			<!-- BEGIN PAGE CONTENT -->
			<div class="page-content">
				<div class="container">
					<!-- BEGIN PAGE CONTENT INNER -->
					<div class="row">
						<div class="col-md-12">
							<!-- BEGIN PORTLET-->
							<div class="portlet light tasks-widget simulate simulate-4-green">
								<div class="portlet-title tabbable-line gj-title-green">
									<div class="caption caption-md">
										<i class="icon-globe theme-font hide"></i>
										<span class="caption-subject theme-font bold" style="color: #fff!important;">110kV兴福线</span>
									</div>
								</div>
								<div class="note note-success note-bordered">
									<h4 style="font-size:22px;" class="block">故障已解除！</h4>
								</div>
								<div class="portlet-body fix-height">
									
									<div class="font-grey-mint font-sm">
										链路名称：
									</div>
									<div class="font-md font-blue-sharp" v-text="gaojing.lineName"></div>
									<p style="border-bottom: 3px solid #F4F6F9;"></p>
									<div class="font-grey-mint font-sm margin-top-10">
										涉及业务名称：
									</div>
									<div class="font-md font-blue-sharp">
										<p v-for="work in gaojing.works" v-text="work"></p>
									</div>
									<div class="font-grey-mint font-sm margin-top-10">
										故障类型：
									</div>
									<div class="font-md font-blue-sharp" v-text="gaojing.status"></div>
									<div class="font-grey-mint font-sm margin-top-10">
										故障时间：
									</div>
									<div class="font-md font-blue-sharp" v-text="gaojing.times"></div>
									<div class="font-grey-mint font-sm margin-top-10">
										故障断点距起点（米）：
									</div>
									<div class="font-md font-blue-sharp" v-text="gaojing.distance"></div>
									<div class="font-grey-mint font-sm margin-top-10">
										故障点地理位置：
									</div>
									<div class="font-md font-blue-sharp">
										在节点【{{gaojing.origin}}】和节点【{{gaojing.finishing}}】之间。距离节点{{gaojing.origin}}】大约{{gaojing.distance}}米。
									</div>
									<div class="font-grey-mint font-sm margin-top-10">
										联系人
									</div>
									<div class="font-md font-blue-sharp" v-text="gaojing.cancat"></div>
								</div>
							</div>
						</div>
						<!-- END PORTLET-->
					</div>
				</div>

				<!-- END PAGE CONTENT INNER -->
			</div>
		</div>
	<!-- END PAGE CONTENT -->
	</div>
	<!-- END PAGE CONTAINER -->

<script src="assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script src="assets/layer/layer.js" type="text/javascript"></script>
<script src="assets/js/vue.js"></script>
<script src="assets/js/axios.min.js"></script>
<script src="assets/js/xlsx.full.min.js"></script>
<script src="assets/js/config.js"></script>

</body>
<!-- END BODY -->
<script>
	(function($) {
		$.extend({       
			urlGet:function(key)
			{
				var aQuery = window.location.href.split("?");  //取得Get参数
				var aGET = new Array();
				if(aQuery.length > 1)
				{
					var aBuf = aQuery[1].split("&");
					for(var i=0, iLoop = aBuf.length; i<iLoop; i++)
					{
						var aTmp = aBuf[i].split("=");  //分离key与Value
						aGET[aTmp[0]] = aTmp[1];
					}
				}
				console.log(key);
				if(!key){
					return aGET
				}
				if(aGET[key]){
					return aGET[key]
				}else{
					return undefined
				}
			}
		})
	})(jQuery);
	jQuery(document).ready(function() {
        const {createApp} = Vue;
        const app = createApp({
			data(){
				return {
					gaojingId:0,
					gaojing:{}
				}
			},
            methods:{
                async load(){
					if(this.gaojingId > 0){
						layer.load(0,{msg:"努力加载中，请稍后......"});
                        axios.post(config.getUrl() + "/getGaojing",{gaojingId:this.gaojingId}).then(res => {
                            if(res.status == 200){
                                layer.closeAll();
                                console.log(res.data.data);
                                if(res.data.code == 0){
									let dt = res.data.data;
									if(dt.times){
										let tm = new Date(dt.times - 1000);
										dt.times = `${tm.toLocaleDateString().replace(/\//g,"-")} ${tm.toTimeString().substr(0,8)}`;
									}
									if(dt.works){
										dt.works = JSON.parse(dt.works);
									}
									this.gaojing = res.data.data;
                                }else{
                                    layer.msg(res.data.msg,{time:3000});
                                }
                            }else{
                                layer.closeAll();
                                layer.msg("网络错误",{time:3000});
                            }
                        }); 
					}
				}
            },
            created(){
				this.gaojingId =  $.urlGet("gaojingId");
                this.load()
			}
        });
        app.mount("#app")
    });
</script>
</html>